<!DOCTYPE html>
<html lang="en" class="no-js" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<title>查询</title>
<link rel="stylesheet" type="text/css" href="/static/query/query/css/normalize.css" />
<link rel="stylesheet" type="text/css" href="/static/query/query/css/demo.css" />
<!--必要样式-->
<link rel="stylesheet" type="text/css" href="/static/query/query/css/component.css" />
<script src="https://ssl.captcha.qq.com/TCaptcha.js"></script>
<script th:src="@{/static/jquery/jquery-3.4.1.min.js}"></script>
<!--[if IE]>
<script src="/static/query/query/js/html5.js"></script>
<![endif]-->
</head>
<body>
		<div class="container demo-1">
			<div class="content">
				<div id="large-header" class="large-header">
					<canvas id="demo-canvas"></canvas>
					<div class="logo_box">
						<h3>欢迎你</h3>
						<form action="#" name="f" method="post">
							<div class="input_outer">
								<span class="u_user"></span>
								<input name="contact" class="text" style="color: #FFFFFF !important" type="text" placeholder="请输入联系方式">
							</div>
							<div class="input_outer">
								<span class="us_uer"></span>
								<input name="password" class="text" style="color: #FFFFFF !important; position:absolute; z-index:100;"value="" type="password" placeholder="请输入取货密码">
							</div>
							<div class="mb2"><button id="TencentCaptcha" data-appid="194768882" data-cbfn="callback" type="button" class="act-but submit" style="color: #FFFFFF;width: 100%;border: 0;">验证</button></div>
							<div class="mb2"><a class="act-but submit" id="submit" href="javascript:;" style="color: #FFFFFF">查询</a></div>
						</form>
					</div>
				</div>
			</div>
		</div><!-- /container -->
<script>
	window.callback = function(res){
		console.log(res)
		// res（用户主动关闭验证码）= {ret: 2, ticket: null}
		// res（验证成功） = {ret: 0, ticket: "String", randstr: "String"}
		if(res.ret === 0){
			$.ajax({
				type:"post",
				url:"/ajax/QueryVf",
				data:{ticket:res.ticket,
					randstr:res.randstr},
				success:function (data) {
					if(data == 1){
						var capbtn = document.getElementById("TencentCaptcha");
						capbtn.innerText = "验证通过";
						$("#TencentCaptcha").css("background","#00e63e");
					}else if(data == -1){
						var capbtn = document.getElementById("TencentCaptcha");
						capbtn.innerText = "重新验证";
						$("#TencentCaptcha").css("background","#e60000");
					}
				}

			});
		}
	}
</script>
<script>
	$("#submit").click(function () {
		var contact = $("input[name='contact']").val();
		var password = $("input[name='password']").val();
		if(contact == "" || password == ""){
			alert("输入框不能为空！");
		}else{
			window.location.href="/queryList/?contact="+contact+"&password="+password;
		}
	});
</script>
		<script src="/static/query/query/js/TweenLite.min.js"></script>
		<script src="/static/query/query/js/EasePack.min.js"></script>
		<script src="/static/query/query/js/rAF.js"></script>
		<script src="/static/query/query/js/demo-1.js"></script>
	</body>
</html>